/** 
* 1 发送请求获取数据 
* 2 点击轮播图 预览大图
*   2.1 给轮播图绑定点击事件
*   2.2 调用小程序的api previewImage
*/


import regeneratorRuntime from '../../lib/runtime/runtime';
/* 
1 引入 用来请求的 方法
2 wechat miniprogram, 一定要把路径补全
*/
import {
  request
} from "../../request/index.js"
// pages/goods_detail/index.js
Page({
  /**
   * 页面的初始数据
   */
  data: {
    // 在data里面,存放一个对象goodsObj
    goodsObj: {}
  },
  // 商品对象
  GoodsInfo: {},

  /**
   * 1 生命周期函数--监听页面加载
   * 2 点击不同的商品列表项,给商品详情页面传递不同的包含goods_id的options
   */
  onLoad(options) {
    console.log(options)
    const { goods_id } = options;
    console.log(goods_id)

    // this.getGoodsDetail(goods_id)
    this.getGoodsDetail()
  },
  // 获取商品详情数据
  async getGoodsDetail(goods_id) {
    // 传递一个参数: data:{goods_id}
    // const res=await request({url:"/goods/details",data:{goods_id}})
    // const goodsObj=await request({url:"/goods/detail", data:{goods_id}})
    const goodsObj = await request({ url: "/goods/details" })
    // console.log(goodsObj)
    // 给商品对象重新赋值
    console.log("goodsObj",goodsObj)
    this.GoodsInfo = goodsObj;
    this.setData({
      /* 
      * 1 默认: goodsObj=goodsObj?
      * 2 如何重构goodsObj数据源,删除多余的数据源属性 
      */

      /* 
      // iphone部分手机 不识别 webp图片格式
      // 最好找到后台 让他进行修改
      // 临时自己改 确保后台存在 1.webp =>1.jpg
      */
      goodsObj: {
        goods_id: goodsObj.goods_id,
        goods_price: goodsObj.goods_price,
        goods_name: goodsObj.goods_name,
        goods_introduce: goodsObj.goods_introduce.replace(/\.webp/g,'.jpg'),
        pics: goodsObj.pics,
      }
    })
    // this下面的data数据配置项里面的goodsObj, 逐级引用
    console.log(this.data.goodsObj)
  },

  // 点击轮播图,放大预览 (e:事件源对象)
  handlePreviewImage(e) {
    // 1 先构造要预览的图片数组,通过map函数构造
    const urls = this.GoodsInfo.pics.map(v=>v.pics_mid)
    // console.log('%c' + "预览","color:red;font-size:100px;background-image:linear-gradient(to right,#0094ff,pink)")
    // console.log('%c' + "This is a styled message", 'color: red; font-size: 20px;');
    // 2 接收传递过来的图片url
    console.log("e",e)
    const current = e.currentTarget.dataset.url;

    wx.previewImage({
      /*
      * 1 左右两边相同名称,都是解构, 可以只写一个
      * 2 urls[0] = (website of pics[0]) http://dummyimage.com/200x100/50B347/FFF&text=details.js
      * 2 urls[1] = (website of pics[1]) http://dummyimage.com/200x100/50B347/FFF&text=details.js
      * 2 urls[2] = (website of pics[2]) http://dummyimage.com/200x100/50B347/FFF&text=details.js
      * 2 urls[3] = (website of pics[3]) http://dummyimage.com/200x100/50B347/FFF&text=details.js
      * 2 urls[4] = (website of pics[4]) http://dummyimage.com/200x100/50B347/FFF&text=details.js
      */  
      // current: urls[0],
      current,
      urls,
    });
  },


  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {
    // const { goods_id } = options;
    // console.log(goods_id)

    // this.getGoodsDetail(goods_id)
    this.getGoodsDetail()
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})